import React from 'react'
import PropTypes from 'prop-types'
import {Avatar, Table} from 'antd'
import config from 'config'
import AnimTableBody from 'components/DataTable/AnimTableBody'
import '../../../utils/index'

const timestampToTime = (timestamp) => {
  let dateObj = new Date(timestamp)
  return dateObj.format('yyyy-qq-dd HH:mm:ss')
}

const List = ({ location, isMotion, ...tableProps }) => {

  const getAvatarText = (record) => {
    const { friendNickname, customerWxId } = record
    if (friendNickname) {
      return friendNickname.substr(friendNickname.length - 1, friendNickname.length)
    } else {
      return customerWxId ? customerWxId.substr(0, 1).toUpperCase() : 'D'
    }
  }

  const { dataSource } = tableProps
  let sum = dataSource.reduce((ret, item) => {
    ret.orderAmount = ret.orderAmount ? ret.orderAmount + item.orderAmount : item.orderAmount
    ret.orderCount = ret.orderCount ? ret.orderCount + item.orderCount : item.orderCount
    ret.signPerformance = ret.signPerformance ? ret.signPerformance + item.signPerformance : item.signPerformance
    ret.signOrderCount = ret.signOrderCount ? ret.signOrderCount + item.signOrderCount : item.signOrderCount
    ret.followPerformance = ret.followPerformance ? ret.followPerformance + item.followPerformance : item.followPerformance
    ret.followCount = ret.followCount ? ret.followCount + item.followCount : item.followCount
    ret.backPerformance = ret.backPerformance ? ret.backPerformance + item.backPerformance : item.backPerformance
    ret.backCount = ret.backCount ? ret.backCount + item.backCount : item.backCount
    return ret
  }, {})

  const handleSum = (value, record) => {
    console.log(value, record)
    return "下单金额"
  }

  const columns = [
    {
      title: '头像',
      dataIndex: 'icon',
      key: 'icon',
      width: 130,
      render: (avatar, record, index) => avatar ? <Avatar src={avatar} size="large" /> :
        <Avatar style={{ backgroundColor: config.randomColor(index), verticalAlign: 'middle' }}
          size="large">{getAvatarText(record)}</Avatar>,
    },
    {
      title: '运营微号',
      dataIndex: 'wxNo',
      key: 'wxId',
      render: (val, record) => val ? val : record.wxId
    },
    {
      title: '归属员工',
      dataIndex: 'belongEmpName',
      key: 'belongEmpName',
    },
    {
      title: "公司部门",
      dataIndex: 'deptName',
      key: 'deptName'
    },
    {
      title: "总条数",
      dataIndex: "totalNumber",
      key: 'totalNumber',
      render: val => val ? val : 0
    },
    {
      title: "最高点赞数",
      dataIndex: 'topUp',
      key: 'topUp',
      render: val => val ? val : 0
    },
    {
      title: "累计点赞数",
      dataIndex: 'totalUp',
      key: 'totalUp',
      render: val => val ? val : 0
    },
    {
      title: "最高评论数",
      dataIndex: 'topComment',
      key: 'topComment',
      render: val => val ? val : 0
    },
    {
      title: "累计评论数",
      dataIndex: 'totalComment',
      key: 'totalComment',
      render: val => val ? val : 0
    }
  ]

  const AnimateBody = (props) => {
    return <AnimTableBody {...props} />
  }

  const CommonBody = (props) => {
    return <tbody {...props} />
  }

  return (
    <Table
      {...tableProps}
      columns={columns}
      scroll={{ x: 1400 }}
      simple
      rowKey={record => record.id}
      components={{
        body: { wrapper: isMotion ? AnimateBody : CommonBody },
      }}
    />
  )
}

List.propTypes = {
  location: PropTypes.object
}

export default List
